<template>
  <view class="release-subselect-container">
    <!-- 自定义导航栏 -->
    <navigation-bar>
      <navigator
        style="position: absolute;top: 50%;transform: translateY(-50%);left: 20px;font-size: 16px;line-height: 16px;color: #000;"
        class="iconfont" hover-class="none" open-type="navigateBack">&#xe61a;</navigator>
      <view class="top-title-bar">
        发布闲置
      </view>
    </navigation-bar>
    <view class="release-area-list"
      :style="{height: `calc(100% - ${statusbarHeight}px - ${bar_topHeight}px - 100rpx)`}">
      <navigator url="/subpkg/release-start/release-start?releaseType=闲置&subReleaseType=精确" class="release-item"
        style="margin-bottom: 20rpx;">
        <view class="title">
          精确发布
        </view>
        <view class="tip">
          上传精确发布，即刻投放到广场让所有人看到你的闲置。
        </view>
      </navigator>
      <navigator url="/subpkg/release-start/release-start?releaseType=闲置&subReleaseType=快速" class="release-item">
        <view class="title">
          快速发布
        </view>
        <view class="tip">
          快速批量发布，即刻投放到广场让所有人看到你的闲置。
        </view>
      </navigator>
    </view>
  </view>
</template>

<script>
  import naviHeightMix from "@/mixins/get-NavigationBar_Height.js"
  export default {
    mixins: [naviHeightMix],
    data() {
      return {

      };
    }
  }
</script>

<style lang="scss">
  .release-subselect-container {
    height: 100%;

    .release-area-list {
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;

      .release-item {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        width: 82.51%;
        height: 144.11rpx;
        background-color: #F3F3F3;
        border-radius: 12rpx;

        .title {
          margin: 28rpx 0;
          font-size: 28rpx;
          font-weight: 800;
        }

        .tip {
          margin-bottom: 8rpx;
        }
      }
    }
  }
</style>